<template>
	<view>
		<view class="setting-menu">
			<view class="uni-list">
				<view class="uni-list-cell" hover-class="uni-list-cell-hover" @tap="cutPage('/pages/personal-data/personal-data')">
					<view class="uni-list-cell-navigate uni-navigate-right uni-media-list ">
						<view class="uni-media-list-logo">
							<image :src="avatar" lazy-load="true"></image>
						</view>
						<view class="uni-media-list-body">
							<view class="uni-media-list-text-top">{{userInfo.userLevel||'游客'}}</view>
							<view class="uni-media-list-text-bottom uni-ellipsis">{{userInfo.nickname||userInfo.realname||userInfo.username||'请登录后使用'}}</view>
						</view>
					</view>
				</view>
				<view class="uni-list-cell" hover-class="uni-list-cell-hover" v-if="false">
					<view class="uni-list-cell-navigate uni-navigate-right">
						我的收货地址
					</view>
				</view>
			</view>
			<view class="uni-list list-space">
				<view class="uni-list-cell" hover-class="uni-list-cell-hover" @tap="cutPage('/pages/account-security/account-security')">
					<view class="uni-list-cell-navigate uni-navigate-right" note="描述">
						账户安全
					</view>
				</view>
			</view>
			<view class="uni-list list-space">
				<view class="uni-list-cell" hover-class="uni-list-cell-hover">
					<view class="uni-list-cell-navigate uni-navigate-right">
						问题反馈
					</view>
				</view>
				<view class="uni-list-cell" hover-class="uni-list-cell-hover">
					<view class="uni-list-cell-navigate uni-navigate-right">
						关于应用
					</view>
				</view>
				<!--  #ifdef  APP-PLUS -->
				<view class="uni-list-cell" hover-class="uni-list-cell-hover" @tap="checkUpdate()">
					<view class="uni-list-cell-navigate uni-navigate-right edit-list-cell">
					    <view class="edit-list-left">
					        <text class="uni-title uni-ellipsis">新版本检测</text>
					    </view>
					    <view class="edit-list-right">
					        <text class="uni-h5">{{version}}</text>
					    </view>
					</view>
				</view>
				<!--  #endif -->
			</view>
		</view>
		<button class="footer-botton" @tap.stop="outLogin">退出当前账户</button>
	</view>
</template>

<script>
	import { getAvatar } from '@/utils'
	import update from '@/utils/update'
	export default {
		data() {
			return {
				userInfo:{},
				avatar:'',
				version:'0.0.1',
				flag:false
			};
		},
		created(){
			// #ifdef  APP-PLUS
				var that = this
				plus.runtime.getProperty(plus.runtime.appid, wgtinfo => {
					that.version = wgtinfo.version
				});
			// #endif
		},
		onShow(){
			this.userInfo = uni.getStorageSync('userInfo');
			this.avatar = getAvatar();
		},
		methods: {
			/**
			 * 切换页面
			 */
			cutPage(pageUrl) {
				uni.navigateTo({
					url: pageUrl
				});
			},
			
			/**
			 * 退出当前账户
			 */
			outLogin(){
				uni.showModal({
					title: '退出登录',
					content: '退出后某些功能需要登陆后才可使用!',
					success: function (res) {
						if (res.confirm) {
							uni.setStorageSync('token', 'false');
							uni.setStorageSync('userId', '0');
							uni.redirectTo({
							    url: '/pages/login/login'
							});
						}
					}
				});
			},
			
			/**
			 * 检测版本
			 * */
			// #ifdef  APP-PLUS
			checkUpdate(){
				var that = this;
				if(that.flag){return;}
				that.flag = true;
				if(update.downloadTask){
					uni.showModal({
						title: '提示',
						content: "更新中",
						showCancel: false,
						complete: () => {
							that.flag = false;
						}
					})
				}else{
					update.checkUpdate({silent:false}).then(()=>{
						if(update.downloadTask){
							uni.showModal({
								title: '提示',
								content: "更新中",
								showCancel: false,
								complete: () => {
									that.flag = false;
								}
							})
						}else{
							that.flag = false;
						}
					})
				}
			}
			// #endif
		}
	}
</script>

<style lang="less">
	.uni-media-list-logo{
		border-radius:100%;
		overflow: hidden;
	}
	.setting-menu{
		margin-bottom:92upx;
	}
	.footer-botton{
		position:fixed;
		left: 0;
		right: 0;
		bottom: 0;
		border-radius: 0;
		color: #fff;
		background-color: #4FD2C1;
	}
</style>
